// Copyright 2012-present OSBI Ltd
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
//     http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.

@import 'styles/helpers/variables';

.sku-login {
  .sku-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 24px 30px;
  }

  form {
    padding: 30px;
    border-radius: 3px;
    background-color: $saiku-color-primary;

    label {
      color: #fff;
    }

    .btn-password-mask {
      text-decoration: none !important;
    }

    .form-group-button {
      .link-button {
        color: #fff;

        &:hover {
          color: #fff;
          text-decoration: underline !important;
        }
      }

      button[type='submit'] {
        text-decoration: none !important;
      }
    }

    .sku-evaluation-panel {
      padding: 10px;
      background-color: #222;

      .sku-role-panel {
        button {
          &:hover {
            text-decoration: none !important;
          }
        }

        .sku-login-role {
          margin-bottom: 5px;
          padding-bottom: 5px;
          color: #999;
          border-bottom: 1px solid #999;
          text-align: center;
        }

        .sku-login-data {
          float: left;
          width: 100%;
          padding: 0;
          list-style-type: none;
          color: #666;
          text-align: center;

          li:first-child {
            margin-bottom: 10px;
          }
        }
      }
    }
  }

  .sku-login-footer {
    ul {
      margin: 0;
      padding: 0;
      list-style-type: none;
      color: $color-secondary;
      text-align: center;

      li {
        display: inline-block;

        .link-button {
          &:hover {
            outline: 5px solid $saiku-color-primary;
            background-color: $saiku-color-primary;
          }

          &:active,
          &:focus {
            outline: 0;
            background-color: inherit;
          }
        }
      }
    }
  }
}
